<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>男装专区</title>
    <link rel="stylesheet" type="text/css" href="<%=path %>/statics/css/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="<%=path %>/statics/css/loading.css"/>
    <link rel="stylesheet" type="text/css" href="<%=path %>/statics/css/base.css"/>
    <link rel="stylesheet" type="text/css" href="<%=path %>/statics/css/style.css"/>
      <script src="<%=path %>/statics/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
      <script type="text/javascript" src="<%=path %>/statics/js/jaliswall.js"></script>
    <script type="text/javascript">
    	$(window).load(function(){
    		$(".loading").addClass("loader-chanage")
    		$(".loading").fadeOut(300);
    		$('.wall').jaliswall({ item: '.pic' });
    		
    		$(".text-top").on("touchstart",function(){
    			$(".collectbar").fadeToggle(500);
    		});
    		
    	})
    	var num=0;
    	var arrList1=[];
    	var checkedt=0;
    	function ckick(opr){
    	for (var i=0;i<arrList1.length;i++)
{

if(arrList1[i]!=null){
checkedt =arrList1[i];
$.ajax({

		type:"GET",

		url:opr+"/user/sys/delCollect.json",

		data:{id:arrList1[i]},

		dataType:"json",

		success:function(data){

			if(data.res=="true"){
			
				$("#li"+data.proid).hide(100);
			}

		},

		error:function(data){

			
		}

	});
}
}
    	
    	}
    	
    	function mycheck(val)
		{
			if($("#collect"+val).is(':checked'))
			{
			arrList1[num]=val;
			
			num++;
				$(".label"+val).addClass("collectd");
				$(".collectbox").fadeIn(300)
				$(".kong").fadeIn()
			}
			else
			{num--;
		
			arrList1[num]=null;
			$(".label"+val).removeClass("collectd");
				
				
				
				$(".collectbox").fadeOut(300)
				$(".kong").fadeOut()
				
			}
		}
    	
    </script>
</head>
<!--loading页开始-->
<div class="loading">
	<div class="loader">
        <div class="loader-inner pacman">
          <div></div>
          <div></div>
          <div></div>
          <div></div>
          <div></div>
        </div>
	</div>
</div>
<!--loading页结束-->
<body>
	<header class="top-header fixed-header">
		<a class="icona" href="javascript:history.go(-1)">
				<img src="<%=path %>/statics/images/left.png"/>
			</a>
		<h3>我的收藏</h3>
			
			<a class="text-top">
				编辑
			</a>
	</header>
	
	<div class="contaniner fixed-conta">
		<div style="margin-top: 3%;"></div>
		<section class="list">
			<ul class="wall">
			<c:forEach items="${productlist }" var="product" varStatus="abc">
				<li class="pic" id="li${product.id }">
					<a href="<%=path %>/product/detail/${product.id }">
						<img src="<%=path %>/statics/files/${product.fileName }"/>
						<p>${product.description }</p>
						<b>￥${product.price }</b><del></del>
						<div class="collectbar">
							<label for="collect${product.id }"  onselectstart="return false" class="label${product.id }"></label>
							<input type="checkbox" onclick="mycheck('${product.id }')" id="collect${product.id }"/>
						</div>
					</a>
				</li>
			</c:forEach>
			
				
				
			</ul>
		</section>
		<div class="kong" style="margin-bottom: 16%;"></div>
	</div>
	
<footer class="collectbox fixed-footer">
	
	<input type="button" onclick="ckick('<%=path %>');" value="确认删除" />
</footer>

	
	

</body>
</html>